<%@ page contentType="text/html;charset=UTF-8" language="java" %>  
<%@ page import="java.util.*" %>  
<%  
    String path = request.getContextPath();  
    String basepath = request.getScheme() + "://" + request.getServerName() + ":" +  
            request.getServerPort() + path + "/";  
%>  
<html>  
<head>  
    <base href="<%=basepath%>">  
  
    <title>sunnylinner的WebSocket</title>  
    <meta http-equiv="pragma" content="no-cache">  
    <meta http-equiv="cache-control" content="no-cache">  
    <meta http-equiv="expires" content="0">  
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
    <meta http-equiv="description" content="This is my page">  
  
</head>  
<body>  
<input type="hidden" value="${content}" id="content">  
<form action="TestServlet" method="post">  
    content: <input type="text" name="content">  
    <button type="submit">登陆</button>  
</form>  
<span id="span">  
  
</span>  
<span id="span1">  
  
</span>  

<script type="text/javascript">
    /** 
     * Created by Administrator on 2016/9/14. 
     */  
    var ws = new WebSocket("ws://127.0.0.1:8887");  
    ws.onopen = function () { // 当websocket创建成功，即会触发onopen事件  
        var content = document.getElementById("content").value;  
        if (content == null && content == ""){  
            ws.send("sunnylinner"); // 用于将消息发送到服务端  
            document.getElementById("span1").innerHTML="1@@1";  
        } else {  
            ws.send(content);  
            document.getElementById("span1").innerHTML="2@@2";  
        }  
    };  
    ws.onmessage = function (evt) {  
        // 当客户端收到服务端发送来的消息时，会触发onmessage事件，参数evt.data中包含server传输过来的数据  
        document.getElementById("span1").innerHTML="3@@3";  
        document.getElementById("span").innerHTML="当前在线人数为：" + evt.data;  
    };  
    ws.onclose = function () {  
        // 当客户端收到服务端发送的关闭连接的请求时，触发onclose事件  
        alert("WebSocketClosed!");  
    };  
    ws.onerror = function () {  
        // 如果出现连接，处理，接收，发送数据失败的时候就会触发onerror事件  
        alert("WebSocketError!");  
    }
    </script>
</body>  
</html>  